<div class="headerTop">
<div class="tool">
    <div class="tool-au">
        <div id="bl" class="swiper-container lunbo">
            
          <div id="div1" class="swiper-wrapper">
            
              <div class="swiper-slide"><span>你喊山东黄金时懂事......</span></div>
              <div class="swiper-slide"><span>王企鹅无群非人为...</div>
              <div class="swiper-slide"><span>威风威风闻风丧胆是而非额二....</span></div>
              <div class="swiper-slide"><span>二维让问问他也同样 一条而违法让他人人..</span></div>
              <div class="swiper-slide"><span>王企鹅无通过trytry体育try太热...</span></div>
            
        </div>
        </div>
        
        <div class="tool-au-bp">
        <div class="tool-au-bp-cq"><img src="/img/gvbhng.jpg" ><a href="#"></a></div>
        <div class="tool-au-bp-cw"><img src="/img/22.jpg" ><a href="#"></a></div>
           <form action="" method="">
          <a href="javascript:;"><img src="/img/vbgfdgbfd.jpg" ></a>
             <input type="text" name="" id="" placeholder="请输入想要的宝贝" id="constyle"/>
           </form>
         <a href="/html/longin.html" class="not-login"><button class="p1"  type="button">立即登录</button></a>
         <a href="javascript:;" class="is-longin"><button type="button">欢迎你：<b id="username"></b></button>
         <button  id="logout-btn" type="button">注销</button></a>
         <script>
           var userInfo = tools.getCookie('userInfo')
            if (userInfo) {
              document.querySelector('.not-login').style.display = 'none'
              document.querySelector('.is-longin').style.display = 'block'
              userInfo = JSON.parse(userInfo)
              document.querySelector('#username').innerHTML = userInfo.username
           }

              document.querySelector('#logout-btn').onclick = function () {
            // 退出登录
            if (confirm('确认注销吗？')) {
            // 删除cookie
           tools.setCookie('userInfo','', {expires: -1, path: '/'})
           // 切换ul显示
           document.querySelector('.not-login').style.display = 'block'
          document.querySelector('.is-longin').style.display = 'none'
      }
    }
         </script>
         <button class="p2" type="button"><a href="/html/shopping.html">购物车</a></button>
         
      </div>
        <div class="tool-au-bo" id="tabList">
           <a href="/index.html"><button class="p3" type="button">首页</button></a>
        <a href="/html/category.html"> <button class="p4" type="button">定制手机壳</button></a>
        <button class="p5" type="button">全部商品分类</button>
      </div>
      <script type="text/html" id="tabsTemplate">
      {{each list tab,index}}
      <button class="p4" type="button"><a href="/html/register.html#{{tab.id}}" target="_blank"  border:none;>{{tab.name}}</a></button>
      {{/each}}
      </script> 
    </div>
  </div>
</div>